// 导入gulp模块
const {series, src, dest,watch} = require('gulp');

// 导入插件模块 (压缩js)
const uglify = require('gulp-uglify');
const rename = require('gulp-rename');
const less = require('gulp-less'); //less转css
const clean = require('gulp-clean-css');  //压缩css
const imgs = require('gulp-imagemin');  //压缩img
const webserver = require('gulp-webserver');  //压缩img

// 定义任务
function jsTask() {
    return src('./03-js/**/*.js')  // 源文件地址
    .pipe(uglify())  // 进行源文件压缩处理
    .pipe(rename({
        suffix:'.min'
    }))
    .pipe(dest('./dist/js'))  // 表示处理后的文件放置的位置
}

// 定义css任务
function cssTask() {
    return src('./02-less/**/*.less') //读取源码
        .pipe(less())  //less转css
        .pipe(clean())
        .pipe(rename({
            suffix:'.min'
        }))
        .pipe(dest('./dist/css'))   //css处理后储存
}

// 定义imgs任务
function imgsTask() {
    return src('./01-imgs/**/*.{jpg,png,gif,ico}')  //读取imgs源文件
    .pipe(imgs())
    .pipe(dest('./dist/imgs'))
}

// 上帝之眼: 监听文件变化
function watchTask() {
    // less处理
    watch('./02-less/**/*.less',{
        events:['add','change']
    },cssTask)

    // js处理
    // watch('./03-js/**/*.js',{
    //     events:['add','change']
    // },jsTask)

    // img压缩
    watch('./01-imgs/**/*.{jpg,png,gif,ico}', {
        events:['add', 'change']
    }, imgsTask)
}

// 本地服务器
function serve() {
    return src('./')
        .pipe(webserver({
            livereload: true,  //热更新:自动更新页面
            open: true,  //在浏览器中打开本地服务器
            port: 8080
        }))
}

// 导出
exports.jsTask = jsTask;
exports.cssTask = cssTask;
exports.imgsTask = imgsTask;

exports.default = series(serve, watchTask);